Intro

Supabase Upload Input Element

A basic element to upload files to Supabase.

Components

  • Upload Input Element

    Simply give it your Supabase Key and URL in the attributes.
    User must be logged in to use.

    Attributes

    clear-filesUsed to clear input for now. Create a workflow that simply changes a variable: false -> true -> false
    filesFiles attribute is used if you want to create a download button with previously uploaded files.

    Pass in the file data from supabase.

    Example:

    [
    {
    "Key": "bucket/folder/path/example-file-name.webp",
    "name": "example-file-name.webp"
    }
    ]
    has-filesUsed to show the download button instead of upload input for now.
    Used in conjunction with the 'files' attribute.
    bucket-nameUse this to declare the bucket name
    folder-pathUse this to declare the folder structure (if any) where the files will be uploaded to.

    Example: path/folder-name

    Do not add ' / ' (slash) to the beginning or end of the string.
    max-file-sizeMax file size allowed in MB

    Enter only a number.

    Example: 10
    supabase detailsProject's supabase base URL and Anon Key

    Events

    filesArr
    Returns the uploaded files' key data. This is returned from supabase and used to fetch the files.

    Store this where relevant/needed

Style variables

style-variable-nameDescription of style variable